<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>证监会</title>
    <link rel="stylesheet" type="text/css" href="css/normalize.css"/>
    <link rel="stylesheet" href="css/jquery.jerichotab.css"/>
    <link rel="stylesheet" type="text/css" href="css/index.css"/>
</head>
<body>
<!--header-start-->
<div class="header-box">
    <div class="logo-box">
        <img src="imgs/logo-dh.png" alt="" style="position: relative;margin-left:10px;">
        <img src="imgs/logo-gh.png" alt="" style="position: relative; top:5px;">
    </div>
    <h3 class="logo-title">
        中央纪委国家监委驻中国证监会
    </h3>
    <div class="header-right-box">
        <ul>
            <li class="user">管理员您好</li>
            <li class="pwd">修改密码</li>
            <li class="logout">退出</li>
        </ul>
    </div>
</div>
<!--header-end-->

<!--中间内容区-->
<div class="main-box">
    <!--左侧导航-->
    <div class="left-nav">
        <ul>
            <li>
                <a href="##" class="home active" data-link="main.html">
                    <i class="icon"></i>
                    <span>首页</span>
                </a>
            </li>
            <li>
                <a href="##" class="wdgz">
                    <i class="icon"></i>
                    <span>我的工作</span>
                    <b class="arrow"></b>
                </a>
                <ul class="second-menu">
                    <li>
                        <a href="##" data-link="待办事项.html">
                            <i class="icon"></i>
                            <span>待办事项</span>
                        </a>
                    </li>
                    <li>
                        <a href="##">
                            <i class="icon"></i>
                            <span>已办事项</span>
                        </a>
                    </li>
                    <li>
                        <a href="##">
                            <i class="icon"></i>
                            <span>部门发文</span>
                        </a>
                    </li>
                    <li>
                        <a href="##">
                            <i class="icon"></i>
                            <span>部门收文</span>
                        </a>
                    </li>
                </ul>
            </li>
            <li>
                <a href="##" class="xfgl">
                    <i class="icon"></i>
                    <span>信访管理</span>
                    <b class='arrow'></b>
                </a>
                <ul class="second-menu">
                    <li>
                        <a href="##" data-link="信访管理.html">
                            <i class="icon"></i>
                            <span>信访管理</span>
                        </a>
                    </li>
                </ul>
            </li>
            <li>
                <a href="##" class="xsgl">
                    <i class="icon"></i>
                    <span>线索管理</span>
                </a>
            </li>
            <li>
                <a href="##" class="ajdy">
                    <i class="icon"></i>
                    <span>案件调研</span>
                </a>
            </li>
            <li>
                <a href="##" class="ajgl">
                    <i class="icon"></i>
                    <span>案件管理</span>
                </a>
            </li>
            <li>
                <a href="##" class="ajcl">
                    <i class="icon"></i>
                    <span>案件处理</span>
                </a>
            </li>
            <li>
                <a href="##" class="jzxt">
                    <i class="icon"></i>
                    <span>卷宗系统</span>
                </a>
            </li>
            <li>
                <a href="##" class="fzgj">
                    <i class="icon"></i>
                    <span>辅助工具</span>
                </a>
            </li>
            <li>
                <a href="##" class="gwgd">
                    <i class="icon"></i>
                    <span>公文归档</span>
                </a>
            </li>
            
        </ul>
    </div>
    <!--end-左侧导航-->

    <!--右侧主体-->
    <div class="right-main"></div>
    <!--end-右侧主体-->
</div>
<!--end-中间内容区-->



</body>
<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/jquery.jerichotab.js"></script>
<script>
    $(function () {
        var w = $(document).width();
        var h = $(document).height();
        $('.left-nav').css({ height: h - 60, 'display': 'block' });
        $('.right-main').css({height: h - 60, 'display': 'block'});
        $.fn.initJerichoTab({
            renderTo: '.right-main',
            uniqueId: 'myJerichoTab',
            contentCss: { 'height': $('.right-main').height() - 60 },
            loadOnce: true,
            tabs: [
                {
                    title: '首页',
                    tabFirer: $('.home'),
                    closeable: false,
                    data: { dataType: 'iframe', dataLink: 'main.html' }
                },
               
            ],
            
        });
        function addTab(dom, name, linkSrc) {
            // alert(1)
            console.log(dom, name, linkSrc)
          $.fn.jerichoTab.addTab({
            tabFirer: dom,
            title: name,
            //closeable: true,
            //iconImg: $(this).attr('iconImg'),
            loadOnce: false,
            data: {
                dataType: 'iframe',
                dataLink: linkSrc
            }
          });
        }
        $(window).resize(function() {
            $('.left-nav,.right-main').css({ height: h - 100 });
        })

        // 左侧一级点击事件
        $('.left-nav ul  li  a').on('click',function () {
            var $next = $(this).next()
            if( $next && $next.length>0) {
                $(this).parent().toggleClass('open')
            }else {
                // $('.left-nav ul li').removeClass('active')
                // $(this).parent().addClass('active')
                addTab($(this), $(this).find('span').text(), $(this).data('link'))
            }
        })

        $('.left-nav > ul > li > a').on('click', function() {
            $('.left-nav ul li a').removeClass('active')
            $(this).toggleClass('active')
        })
    })
</script>
</html>